<div class="row animate fadeIn">
    <form class="form-horizontal" id="req_add_form">
    <div class="ibox-title" style="border:none;"><h5 style="color: #00afef"><i>Add</i></h5>
        <div class="ibox-tools">    
             <button class="btn btn-primary btn-sm save-btn-tab" id="submit-uom">Save</button>
             <a id="cancel_add" class="btn btn-sm btn-outline btn-info cancel-btn-tab">Cancel</a>
        </div>
     </div>
     <div class="ibox-content">
        
            <div class="form-group">
                <label class="col-lg-3 control-label">Request Number:</label>
                <div class="col-lg-5">
                    <input type="text" id="req_num" class="form-control" name="request_num" value="<?php echo $req_num[0]->val; ?>">
                </div>
             </div>
             <div class="form-group">
                <label class="col-lg-3 control-label">Request Date:</label>
                 <div class="col-lg-5">
                    <input type="date" id="req_date" class="form-control" name="request_date">
                </div>
            </div>
            <div class="form-group">
                <label class="col-lg-3 control-label">Requested By:</label>
                 <div class="col-lg-5">
                    <select class = "chosen-select" name="request_by" id ="req_by">
                      <option value=""> -- </option>
                      <?php foreach ($users as $usr) { ?>
                        <option value="<?php echo $usr->user_id; ?>" id=""><?php echo $usr->user_name." (".$usr->last_name.", ".$usr->first_name.")"; ?></option>
                      <?php } ?>
                    </select>
                </div>
            </div>
            <div class="form-group">
                <label class="col-lg-3 control-label">Approved By:</label>
                <div class="col-lg-5">
                    <input type="text" id="req_aprv" class="form-control" name="approve_by" readonly>
                </div>
            </div>
            <div class="form-group">
                <label class="col-lg-3 control-label">Status:</label>
                <div class="col-lg-5">
                    <select class = "chosen-select" name="request_stat" id ="req_stat">
                      <!-- <option value=""> -- </option> -->
                      <?php foreach ($status as $stat) { ?>
                        <option value="<?php echo $stat->lookup_code; ?>" id="" <?php echo ($stat->lookup_code == 'REQ_SUBMITTED' ? 'selected' : ''); ?> ><?php echo $stat->meaning; ?></option>
                      <?php } ?>
                    </select>
                </div>
            </div>
      </div>
    </form>


  <div id="req_content">
      <div id="" class="ibox-content">
        <h3 style="color: #00afef">Requested Item</h3>
          <form  id="req_add_content" class="form-inline">
              <input type="hidden" id="req_id" name="c_req_id">
                  <table id="pgTable"class="table table-bordered" style="width:80%;">
                    <thead>
                      <tr>
                        <th style="width:100px;">Sequence</th>
                        <th>Item</th>
                        <th style="width:100px;">Qty</th>
                        <th style="width:50px;">Action</th>
                      </tr>
                      <tr>
                        <td style="margin:0px;padding:0px;">
                            <input style="width:100%;text-align: right;" type="text" id="req_seq" name="req_sequence" class="form-control-custom">
                        </td>
                        <td style="margin:0px;padding:0px;">
                            <select id="req_item" class="chosen-select" name="request_item">
                                <option value=""> -- </option>
                                <?php foreach ($items as $item) { ?>
                                    <option value="<?php echo $item->item_id; ?>"><?php echo $item->item_num.'  ('.$item->description.')'; ?></option>
                                <?php } ?>
                            </select>
                        </td>
                        <td style="margin:0px;padding:0px;">
                          <input style="width:100%;text-align: right;" type="number" id="req_qty" name="request_qty" class="form-control-custom">
                        </td>
                        <td style="margin:0px;padding:0px;">
                            <a style="width:100%;" class="btn btn-white" id="save_content"><i class="fa fa-plus success"></i></a>
                        </td>
                        
                      </tr> 
                    </thead>
                    </form>
                    <tbody id="tbodyadd_con" class="animate fadeIn">
                                                      
                    </tbody>
                  </table> 
      </div>
    </div>
    
 </div>
 <script>
    $(document).ready(function(){
    $('#req_add_form').data('serialize',$('#req_add_form').serialize());
    $('#req_content').hide();
    $(".chosen-select").chosen({width:"100%;"}); 
    $('#req_stat option:not(:selected)').attr('disabled', true).trigger('chosen:updated');


    $.validator.setDefaults({ ignore: ":hidden:not(select)" });
    $("#req_add_content").validate({
        rules: {
                req_sequence: {
                  required: true
                },
                request_item: {
                  required: true
                },
                request_qty: {
                  required: true,
                  number:true
                }
              }
            });


    $('#save_content').click(function(){
      if($("#req_add_content").valid() == true){
         $.ajax({
              url: "<?php echo base_url($this->session->userdata('forajax') . '/insert_req_content'); ?>",
              method:'post',
              data: $('#req_add_content').serialize(),
              dataType:'json',
              success: function (data) {
                  if(data[0].error == 1){
                      notifymsg("danger",data[0].msg);
                  }else{
                      notifymsg("success",". . .Request Contents Added Successfully");
                      $('#tbodyadd_con').empty();
                      var trHTML = '';
                      $.each(data, function(i, item) {
                          trHTML += '<tr><td>' + data[i].sequence_num + '</td><td text-align:right;>' + data[i].item_num + ' ('+data[i].description+')' + '</td><td text-align:right;>' + data[i].inv_item_qty + '</td><td></td></tr>';
                      });
                      $('#tbodyadd_con').append(trHTML);
                      $("#req_item option:first").attr('selected','selected').trigger('chosen:updated');
                      $('#req_add_content')[0].reset();
                  }  
              }
           });
        }

        // $('#tbodyadd_con').append("<tr><td>"+$('#sample_seq').val()+"</td><td>"+$('#sample_item').val()+"</td><td>"+$('#sample_qty').val()+"</td><td></td></tr>");
        // $('#sample_seq').val(''); $('#sample_item').val('1').change();  $('#sample_qty').val('');
    });   

    $.validator.setDefaults({ ignore: ":hidden:not(select)" })
    $('#req_add_form').validate({
        rules :{
            request_num:{
                required: true
            },
            request_date:{
                required: true
            },
            request_by:{
                required: true
            },
            request_stat:{
                required: true
            }
        },submitHandler: function(form){
          dataString = $("#req_add_form").serialize();
          $.ajax({
            type: "POST",
            url: "<?php echo base_url($this->session->userdata('forajax').'/insert_request'); ?>",
            data: dataString,
            dataType: 'json',
          success: function(data){
            if(data[0].error == 1){
                notifymsg("danger",data[0].msg);
            }else{
                notifymsg("success",". . .New Request Added Successfully");
                mID = data[0].id; console.log(mID);
                $('#req_id').val(mID);
                $('#req_content').show();
                $('#req_add_form').find('input, button').attr('disabled','disabled');
                // $('#rate_ena').attr('disabled','disabled');$('input').iCheck('update');
                $('#cancel_add').html('Complete');
            }
          }      
         });   
        }
      });

      


      function alert_cancel(){
            if($('#req_add_form').serialize()!=$('#req_add_form').data('serialize')){
                swal({
                    title: "Are you sure?",
                    text: "Your work will not be save",
                    type: "warning",
                    showCancelButton: true,
                    confirmButtonColor: "#DD6B55",
                    confirmButtonText: "Leave",
                    cancelButtonText: "Stay",
                    closeOnConfirm: true,
                    closeOnCancel: true },
                function (isConfirm) {
                    if (isConfirm) {
                        close_add(); active_search();
                        notifymsg("hide","hide");
                    } else {
                        swal("Cancelled");
                    }
                });
                }else{
                close_add(); active_search();
                notifymsg("hide","hide");
            }
        } 
        $('#cancel_add').click(function () {
          if($('#cancel_add').html() == "Complete"){
            close_add(); active_search();
            notifymsg("hide","hide");
          }else{            
            alert_cancel();
          }
        });


      $('#addX').click(function(){
            alert_cancel();      
       });
    });
 </script>  